<template>
  <xr-create
    :loading="loading"
    :width="wkFlowList ? '984px' : '722px'"
    :isCol="false"
    :title="title"
    :confirm-button-text="sureBtnTitle"
    :showConfirm="!(this.isEditR || action.type == 'repay' || this.showFlow)"
    @close="close"
    @save="saveClick"
  >
    <div class="d-flex" style="border-top: 16px solid #f6f7fc">
      <div
        style="width: 254px; border-right: 16px solid #f6f7fc"
        class="mt-20"
        v-if="wkFlowList"
      >
        <create-sections title="审核信息">
          <template slot="header">
            <el-tooltip
              v-if="flowRemarks"
              :content="flowRemarks"
              effect="dark"
              placement="top"
            >
              <i class="wk wk-help wk-help-tips" style="margin-left: 8px" />
            </el-tooltip>
          </template>
          <wk-approval-flow-apply :data="wkFlowList" style="padding: 15px" />
        </create-sections>
      </div>
      <div style="width: 714px" class="mt-20">
        <create-sections title="基本信息">
          <wk-form
            ref="crmForm"
            :model="fieldForm"
            :rules="fieldRules"
            :field-from="fieldForm"
            :field-list="fieldList"
            label-position="top"
            @change="formChange"
          >
            <template slot-scope="{ data }">
              <crm-relative-cell
                v-if="data && data.formType == 'customer'"
                :value="fieldForm[data.field]"
                :disabled="data.disabled"
                relative-type="customer"
                @value-change="otherChange($event, data)"
              />
              <crm-relative-cell
                v-if="data && data.formType == 'contract'"
                :value="fieldForm[data.field]"
                :disabled="data.disabled"
                :relation="data.relation"
                :relative-type="data.formType"
                :ref-type="'receivables'"
                @value-change="otherChange($event, data)"
              />
              <xh-receivables-plan
                v-if="data && data.formType == 'receivables_plan'"
                :value="fieldForm[data.field]"
                :receivables-id="editId"
                :relation="data.relation"
                @value-change="otherChange($event, data)"
              />
            </template>
          </wk-form>
        </create-sections>
      </div>
    </div>

    <el-button
      slot="footer"
      type="primary"
      plain
      @click.native="debouncedSaveField(true)"
      >{{
        isEditR || action.type == "repay" ? "保存修改" : "保存草稿"
      }}</el-button
    >
  </xr-create>
</template>

<script>
import { filedGetFieldAPI } from "@/api/crm/common";
import {
  crmReceivablesSaveAPI,
  crmReceivablesUpdateRAPI
} from "@/api/crm/receivables";

import XrCreate from "@/components/XrCreate";
import CreateSections from "@/components/CreateSections";
import WkForm from "@/components/NewCom/WkForm";
import { XhReceivablesPlan, CrmRelativeCell } from "@/components/CreateCom";
import WkApprovalFlowApply from "@/components/Examine/WkApprovalFlowApply";
import WkApprovalFlowApplyMixin from "@/components/Examine/mixins/WkApprovalFlowApply";
import crmTypeModel from "@/views/crm/model/crmTypeModel";
import CustomFieldsMixin from "@/mixins/CustomFields";
import { debounce } from "throttle-debounce";
import { objDeepCopy } from "@/utils";
import { queryContractByCustomerId } from "@/api/crm/customer";

export default {
  // 新建编辑
  name: "ReceivablesCreate",
  components: {
    XrCreate,
    CreateSections,
    CrmRelativeCell,
    XhReceivablesPlan,
    WkApprovalFlowApply,
    WkForm
  },

  mixins: [CustomFieldsMixin, WkApprovalFlowApplyMixin],

  props: {
    action: {
      type: Object,
      default: () => {
        return {
          type: "save",
          id: "",
          data: {}
        };
      }
    }
  },

  data() {
    return {
      loading: false,
      baseFields: [],
      fieldList: [],
      fieldForm: {},
      fieldRules: {},

      // 审批信息
      flowRemarks: "",
      wkFlowList: null, // 有值有审批流
      isEditR: false, // 是否编辑还款
      showFlow: true
    };
  },

  computed: {
    title() {
      if (this.action.type == "update") {
        this.isEditR = this.action.data.defaultGenerate;
        if (this.isEditR) {
          return "编辑还款";
        }
        return "编辑回款";
      } else if (this.action.type == "repay") {
        return "新建还款";
      } else {
        return "新建回款";
      }
      // return this.action.type == "update" ? "编辑回款" : "新建回款";
    },

    editId() {
      return this.action.type == "update" ? this.action.id : "";
    },

    // 确认名称
    sureBtnTitle() {
      if (this.isEditR || this.action.type == "repay") {
        return "审核通过";
      }
      if (this.wkFlowList) {
        return "提交审核";
      }
      return "保存";
    }
  },

  watch: {},

  created() {
    this.debouncedSaveField = debounce(300, this.saveClick);
    this.getField();
  },

  mounted() {
    console.log(this.refType);
  },

  beforeDestroy() {},

  methods: {
    /**
     * 获取数据
     */

    getField() {
      this.loading = true;
      const params = {
        label: crmTypeModel.receivables
      };
      if (this.action.type == "update") {
        params.id = this.action.id;
      }
      filedGetFieldAPI(params)
        .then(res => {
          const list = res.data || [];
          const fieldList = [];
          const fieldRules = {};
          const fieldForm = {};
          let studentVal = [];
          list.forEach(item => {
            const temp = {};
            temp.field = item.fieldName;
            temp.formType = item.formType;
            temp.fieldId = item.fieldId;
            temp.inputTips = item.inputTips;
            temp.name = item.name;
            temp.setting = item.setting;
            temp.restrictData = item.restrictData;
            if (item.formType === "leve_linkage") {
              //多级下拉option
              temp.levelData = item.levelData;
            }
            if (item.fieldName === "fliedZozdyt") {
              temp.maxlength = item.maxLength;
            }
            if (item.fieldName === "trainingPeriods") {
              temp.maxlength = item.maxLength;
            }

            if (temp.formType == "single_user") {
              // 人员选择 课程讲师
              if (temp.fieldId == 1102038) {
                temp.isTeacher = true;
              } else {
                temp.isTeacher = false;
              }
            }
            const canEdit = this.getItemIsCanEdit(item, this.action.type);
            // 是否能编辑权限
            if (canEdit) {
              // 自动生成编号
              if (item.autoGeneNumber == 1) {
                temp.placeholder = "根据编号规则自动生成，支持手动输入";
                const copyItem = objDeepCopy(item);
                copyItem.isNull = 0;
                fieldRules[temp.field] = this.getRules(copyItem);
              } else {
                fieldRules[temp.field] = this.getRules(item);
              }
            }

            // 是否可编辑
            temp.disabled = !canEdit;

            // 禁止某些业务组件选择
            if (
              temp.formType == "receivables_plan" ||
              temp.formType == "contract" ||
              temp.formType == "customer" ||
              temp.formType == "number_input" ||
              temp.formType == "payment_type" ||
              temp.field == "threePartOrderNo"
            ) {
              if (this.action.type == "relative") {
                const relativeDisInfos = {
                  customer: { customer: true },
                  business: { customer: true },
                  contract: { customer: true, contract: true }
                };
                // 在哪个类型下添加
                const relativeTypeDisInfos =
                  relativeDisInfos[this.action.crmType];
                if (relativeTypeDisInfos) {
                  // 包含的字段值
                  temp.disabled = relativeTypeDisInfos[item.formType] || false;
                }
              } else if (this.action.type == "repay") {
                const relativeDisInfos = {
                  customer: {
                    customerId: true,
                    contractId: true,
                    returnType: true,
                    threePartOrderNo: true
                  }
                };
                // 在哪个类型下添加
                const relativeTypeDisInfos =
                  relativeDisInfos[this.action.crmType];
                if (relativeTypeDisInfos) {
                  // 包含的字段值
                  temp.disabled = relativeTypeDisInfos[item.fieldName] || false;
                }
              } else if (this.action.type != "update") {
                temp.disabled =
                  item.formType === "contract" ||
                  item.formType === "receivables_plan" ||
                  item.formType === "number_input";
              } else if (this.action.type == "update") {
                temp.disabled = item.formType === "number_input";
              }
            }

            if (temp.formType === "number_input") {
              temp.disabled =
                item.formType === "number_input" &&
                item.fieldName != "trainingPeriods";
            }
            // 处理关联
            if (
              this.action.type == "relative" ||
              this.action.type == "update"
            ) {
              // 回款计划 需要合同信息
              if (item.formType === "receivables_plan") {
                const contractItem = this.getItemRelatveInfo(list, "contract");
                if (contractItem) {
                  contractItem["moduleType"] = "contract";
                  temp["relation"] = contractItem;
                }
                // 合同 需要学员信息
              } else if (item.formType == "contract") {
                const customerItem = this.getItemRelatveInfo(list, "customer");
                if (customerItem) {
                  customerItem["moduleType"] = "customer";
                  customerItem["params"] = { checkStatus: 1 };
                  temp["relation"] = customerItem;
                }
              }
            }

            // 特殊字段允许多选
            this.getItemRadio(item, temp);

            // 获取默认值
            fieldForm[temp.field] = this.getItemValue(
              item,
              this.action.data,
              this.action.type
            );
            if (this.action.type != "update") {
              //创建退款时，回显合同相关信息
              if (temp.field == "customerId") {
                let val = this.getItemValue(
                  item,
                  this.action.data,
                  this.action.type
                );
                if (val.length > 0) {
                  studentVal = val;
                  console.log("学员信息------------------------------");
                  console.log(studentVal);
                  temp.disabled = true;
                }
              }
            }
            if (this.action.type == "update") {
              if (this.isEditR) {
                if (temp.field == "money") return;
              } else {
                if (temp.field == "dueMoney") return;
              }
            } else {
              if (this.action.type == "repay") {
                let m = this.action.data;
                if (m) {
                  fieldForm.returnType = m.returnType;
                  fieldForm.threePartOrderNo = m.threePartOrderNo;
                  fieldForm.studentsCall = m.studentsCall;
                  fieldForm.teacherId = m.teacherId;
                }
                if (temp.field == "money") return;
              } else {
                if (temp.field == "dueMoney") return;
              }
            }

            // 分期期数，回款审批截图不显示
            if (temp.field == "installNum" || temp.field == "enclosure") return;
            fieldList.push(temp);
          });

          this.baseFields = list;
          this.fieldList = fieldList;
          this.fieldList.forEach(fieldItem => {
            if (fieldItem.formType === "contract") {
              if (studentVal.length > 0) {
                this.getContractVal(studentVal);
              }
            }
          });
          this.fieldForm = fieldForm;
          this.fieldRules = fieldRules;
          // 审核信息
          this.initWkFlowData(
            {
              params: { label: 2 },
              fieldForm: this.fieldForm
            },
            res => {
              this.showFlow = false;
              this.wkFlowList = res.list;
              this.flowRemarks = res.resData ? res.resData.remarks : "";
              console.log(this.wkFlowList);
            }
          );
          console.log(this.wkFlowList);
          this.loading = false;
        })
        .catch(() => {
          this.loading = false;
        });
    },

    /**
     * 保存
     */
    saveClick(isDraft = false) {
      this.loading = true;
      const crmForm = this.$refs.crmForm.instance;
      crmForm.validate(valid => {
        if (valid) {
          const wkFlowResult = this.validateWkFlowData(this.wkFlowList);
          if (wkFlowResult.pass) {
            const params = this.getSubmiteParams(
              this.baseFields,
              this.fieldForm
            );
            if (isDraft) {
              params.entity.checkStatus = 5;
            }
            if (wkFlowResult.data) {
              params.examineFlowData = wkFlowResult.data;
            }
            this.submiteParams(params, isDraft);
          } else {
            this.loading = false;
            this.$message.error("请完善审批信息");
          }
        } else {
          this.loading = false;
          // 提示第一个error
          this.getFormErrorMessage(crmForm);
          return false;
        }
      });
    },

    /**
     * 提交上传
     */
    submiteParams(params, isDraft = false) {
      if (this.action.type == "update") {
        params.entity.receivablesId = this.action.id;
        params.entity.batchId = this.action.batchId;
        params.entity.defaultGenerate = this.isEditR ? 1 : 0;
      } else if (this.action.type == "repay") {
        params.entity.defaultGenerate = 1; //还款
        params.entity.parentReceivablesId = this.action.data.receivablesId;
      } else {
        params.entity.defaultGenerate = 0; //回款
      }
      // 相关添加时候的多余提交信息
      if (
        this.action.relativeData &&
        Object.keys(this.action.relativeData).length
      ) {
        params = { ...params, ...this.action.relativeData };
      }
      if (!this.isEditR || isDraft) {
        crmReceivablesSaveAPI(params)
          .then(res => {
            this.loading = false;

            this.$message.success(
              this.action.type == "update" ? "编辑成功" : "添加成功"
            );

            this.close();

            // 保存成功
            this.$emit("save-success", {
              type: "receivables"
            });
          })
          .catch(() => {
            this.loading = false;
          });
      } else {
        crmReceivablesUpdateRAPI(params, this.action.id)
          .then(res => {
            this.loading = false;

            this.$message.success(
              this.action.type == "update" ? "编辑成功" : "添加成功"
            );

            this.close();

            // 保存成功
            this.$emit("save-success", {
              type: "receivables"
            });
          })
          .catch(() => {
            this.loading = false;
          });
      }
    },

    /**
     * 验证唯一
     */
    UniquePromise({ field, value }) {
      return this.getUniquePromise(field, value, this.action);
    },

    /**
     * change
     */
    formChange(field, index, value, valueList) {
      // 审批流逻辑
      this.debouncedGetWkFlowList(field.field, this.fieldForm);
    },
    // 选了合同以后，其他项回显
    contractChange(data) {
      const planItem = this.fieldList.find(
        item => item.formType === "receivables_plan"
      );
      if (planItem) {
        if (data.value.length > 0) {
          planItem.disabled = false;
          var contractItem = data.value[0];
          contractItem["moduleType"] = "contract";
          planItem["relation"] = contractItem;
        } else {
          planItem.disabled = true;
          planItem["relation"] = {};
        }
        this.fieldForm[planItem.field] = "";
      }

      // 回显付款方式
      // const returnTypeItem = this.fieldList.find(
      //   item => item.formType === "payment_type"
      // );
      const returnTypeItem = this.fieldList.find(
        item => item.formType === "leve_linkage" && item.field == "returnType"
      );
      if (returnTypeItem) {
        if (data.value.length > 0) {
          // returnTypeItem.disabled = true;
          var contractItem = data.value[0];
          this.fieldForm.returnType = contractItem.returnType;
        } else {
          returnTypeItem.disabled = false;
          this.fieldForm.returnType = "";
        }
      }
    },
    // 合同相关信息回显
    getContractVal(data) {
      // let vipStudentInfo = data[0];
      let res = { data: data[0] };
      // queryContractByCustomerId(data[0].customerId).then(res => {
      // if (res.code == 0) {
      if (res.data && res.data.contractId) {
        this.$set(this.fieldForm, "contractId", [res.data]);
        this.fieldList.forEach(fieldItem => {
          if (fieldItem.field == "returnType") {
            this.$set(this.fieldForm, "returnType", res.data.returnType);
          }
          if (fieldItem.field == "returnTime") {
            this.$set(this.fieldForm, "returnTime", res.data.createTime);
          }
          if (fieldItem.field == "contractMoney") {
            this.$set(this.fieldForm, "contractMoney", res.data.money);
          }
          if (fieldItem.field == "ownerUserId") {
            this.$set(this.fieldForm, "ownerUserId", res.data.ownerUserId);
          }
          if (fieldItem.field == "teacherId") {
            this.$set(
              this.fieldForm,
              "teacherId",
              // vipStudentInfo.teacherId
              res.data.teacherId
            );
          }
          if (fieldItem.field == "trainingPeriods") {
            this.$set(
              this.fieldForm,
              "trainingPeriods",
              // vipStudentInfo.teacherId
              res.data.trainingPeriods
            );
          }
        });
      } else {
        this.$set(this.fieldForm, "contractId", []);
      }
      // }
      // });
      const planItem = this.fieldList.find(
        item => item.formType === "contract"
      );
      planItem.disabled = false;
    },
    /**
     * 地址change
     */
    otherChange(data, field) {
      if (field.formType === "customer") {
        if (data.value.length > 0) {
        } else {
          this.contractChange(data);
        }
        this.fieldList.forEach(fieldItem => {
          fieldItem["relation"] = data.value[0];
          if (fieldItem.formType === "contract") {
            // 如果是合同 改变合同样式和传入学员ID
            // if (data.value.length > 0) {
            //   fieldItem.disabled = false;
            //   const customerItem = data.value[0];
            //   customerItem["moduleType"] = "customer";
            //   customerItem["params"] = { checkStatus: 1 };
            //   fieldItem["relation"] = customerItem;
            // } else {
            //   fieldItem.disabled = true;
            //   fieldItem["relation"] = {};
            //   this.fieldForm.contractId = []
            // }
            if (data.value.length > 0) {
              this.getContractVal(data.value);
            }
            fieldItem.disabled = false;
            // this.fieldForm[fieldItem.field] = [];
          } else if (fieldItem.formType === "receivables_plan") {
            fieldItem.disabled = true;
            fieldItem["relation"] = {};
            this.fieldForm[fieldItem.field] = "";
          }
          // if (fieldItem.field == "trainingPeriods") {
          //   this.fieldForm.trainingPeriods =
          //     data.value.length > 0
          //       ? data.value[0].trainingPeriods
          //       : (this.fieldForm.trainingPeriods = "");
          // }
          //  else if (fieldItem.field == "ownerUserId") {
          //   let str = (data.value.length > 0&&data.value[0].ownerUserId) ? Number(data.value[0].ownerUserId) : "";
          //   this.fieldForm.ownerUserId = str
          // } else if (fieldItem.field == "teacherId") {
          //   this.fieldForm.teacherId =
          //     data.value instanceof Array
          //       ? data.value.length > 0&&data.value[0].teacherId
          //         ? Number(data.value[0].teacherId)
          //         : ""
          //       : this.fieldForm.teacherId;
          // }
          else if (fieldItem.field == "studentsCall") {
            this.fieldForm.studentsCall =
              data.value.length > 0
                ? data.value[0].telephone
                : (this.fieldForm.telephone = "");
          }
        });
      } else if (field.formType === "contract") {
        // this.contractChange(data);
        if (data.value.length > 0) {
          this.getContractVal(data.value);
        }
      } else if (field.formType === "receivables_plan") {
        const dataValue = data.data || {};
        this.fieldForm.returnTime = dataValue.returnDate;
        this.fieldForm.money = dataValue.money;
        this.fieldForm.returnType = dataValue.returnType;
      }
      this.$set(this.fieldForm, field.field, data.value);
      this.$refs.crmForm.instance.validateField(field.field);
    },

    /**
     * 关闭
     */
    close() {
      this.$emit("close");
    }
  }
};
</script>

<style lang="scss" scoped>
.wk-form {
  /deep/ .el-form-item.is-product {
    flex: 0 0 100%;
    width: 0;
  }
}
</style>
